import 'package:ducafe_ui_core/ducafe_ui_core.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:url_launcher/url_launcher.dart';
import '../../common/index.dart';

import 'index.dart';

class LoginPage extends GetView<LoginController> {
  const LoginPage({super.key});

  // 主视图
  Widget _buildView(BuildContext context) {
    return GestureDetector(
      // 点击背景关闭键盘时添加轻微缩放动画
      onTap: () {
        FocusScope.of(context).unfocus();
      },
      // 为整个页面添加滑动动画效果
      child: Container(
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage(AssetsImages.loginBg),
            fit: BoxFit.cover,
          ),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // 欢迎标题添加滑动显示动画
            TweenAnimationBuilder<double>(
              duration: const Duration(milliseconds: 800),
              tween: Tween<double>(begin: 0, end: 1),
              curve: Curves.easeOutQuart,
              builder: (context, value, child) {
                return Transform.translate(
                  offset: Offset((1 - value) * -50, 0),
                  child: Opacity(opacity: value, child: child),
                );
              },
              child: Padding(
                padding: EdgeInsets.only(left: 33.w),
                child: Align(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    "Welcome",
                    style: TextStyle(
                      fontSize: 36.sp,
                      fontWeight: FontWeight.w900,
                      color: Color(0xFFCDFF5F),
                      fontFamily: 'Arial',
                      height: 1.0,
                      fontStyle: FontStyle.normal,
                    ),
                  ),
                ),
              ),
            ),
            SizedBox(height: 8.h),
            TweenAnimationBuilder<double>(
              duration: const Duration(milliseconds: 1000),
              tween: Tween<double>(begin: 0, end: 1),
              curve: Curves.easeOutQuart,
              builder: (context, value, child) {
                return Transform.translate(
                  offset: Offset((1 - value) * -30, 0),
                  child: Opacity(opacity: value, child: child),
                );
              },
              child: Padding(
                padding: EdgeInsets.only(left: 33.w),
                child: Align(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    "Login to your account to continue",
                    style: TextStyle(
                      fontSize: 14.sp,
                      color: Color(0xFFCDFF5F),
                      fontFamily: "Manrope",
                    ),
                  ),
                ),
              ),
            ),
            SizedBox(height: 30.h),
            // 输入框动画效果
            TweenAnimationBuilder<double>(
              duration: const Duration(milliseconds: 600),
              tween: Tween<double>(begin: 0, end: 1),
              builder: (context, value, child) {
                return Opacity(
                  opacity: value,
                  child: Transform.translate(
                    offset: Offset(0, (1 - value) * 20),
                    child: child,
                  ),
                );
              },
              child: Hero(
                tag: 'username_input',
                child: Material(
                  type: MaterialType.transparency,
                  child: CustomInputField(
                    hintText: "Your username",
                    controller: controller.username_controller,
                    keyboardType: TextInputType.emailAddress,
                    onTap: () {
                      // 添加轻微振动反馈
                      HapticFeedback.selectionClick();
                    },
                    onChanged: (text) {
                      // 输入变化时触发控制器更新
                      controller.update();
                    },
                  ),
                ),
              ),
            ),
            // 密码输入框动画效果
            TweenAnimationBuilder<double>(
              duration: const Duration(milliseconds: 800),
              tween: Tween<double>(begin: 0, end: 1),
              builder: (context, value, child) {
                return Opacity(
                  opacity: value,
                  child: Transform.translate(
                    offset: Offset(0, (1 - value) * 20),
                    child: child,
                  ),
                );
              },
              child: Hero(
                tag: 'password_input',
                child: Material(
                  type: MaterialType.transparency,
                  child: CustomInputField(
                    hintText: "Your password",
                    controller: controller.password_controller,
                    obscureText: true,
                    onTap: () {
                      // 添加轻微振动反馈
                      HapticFeedback.selectionClick();
                    },
                    onChanged: (text) {
                      // 输入变化时触发控制器更新
                      controller.update();
                    },
                  ),
                ),
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  "Don't have an account? ",
                  style: TextStyle(color: Colors.white70, fontSize: 12.sp),
                ),
                // 文本链接添加波纹动画效果
                TweenAnimationBuilder<double>(
                  duration: const Duration(milliseconds: 1200),
                  tween: Tween<double>(begin: 0.95, end: 1.05),
                  curve: Curves.easeInOut,
                  builder: (context, value, child) {
                    return InkWell(
                      onTap: () {
                        HapticFeedback.lightImpact();
                        RouteUtil.push(RouteNames.register);
                      },
                      splashColor: Color(0xffCDFF5F).withOpacity(0.3),
                      highlightColor: Color(0xffCDFF5F).withOpacity(0.1),
                      borderRadius: BorderRadius.circular(4.r),
                      child: MouseRegion(
                        cursor: SystemMouseCursors.click,
                        onEnter: (_) => controller.update(),
                        onExit: (_) => controller.update(),
                        child: Padding(
                          padding: EdgeInsets.symmetric(
                            horizontal: 4.w,
                            vertical: 2.h,
                          ),
                          child: Transform.scale(
                            scale: value,
                            child: Text(
                              "Sign up",
                              style: TextStyle(
                                color: Color(0xffCDFF5F),
                                fontWeight: FontWeight.bold,
                                fontSize: 12.sp,
                              ),
                            ),
                          ),
                        ),
                      ),
                    );
                  },
                ),
              ],
            ),
            SizedBox(height: 38.h),
            Padding(
              padding: EdgeInsets.symmetric(horizontal: 20.w),
              child: SizedBox(
                width: double.infinity,
                // 登录按钮添加缩放动画效果
                child: TweenAnimationBuilder<double>(
                  duration: const Duration(milliseconds: 1000),
                  tween: Tween<double>(begin: 0, end: 1),
                  builder: (context, value, child) {
                    return Transform.scale(scale: value, child: child);
                  },
                  child: MouseRegion(
                    cursor: SystemMouseCursors.click,
                    child: GestureDetector(
                      onTapDown: (_) => controller.set_login_button_scale(0.95),
                      onTapUp: (_) => controller.set_login_button_scale(1.0),
                      onTapCancel: () => controller.set_login_button_scale(1.0),
                      child: Obx(
                        () => AnimatedScale(
                          scale: controller.login_button_scale.value,
                          duration: Duration(milliseconds: 150),
                          child: ElevatedButton(
                            onPressed: () {
                              // 添加按钮按下动画效果
                              HapticFeedback.mediumImpact();
                              // 使用当前上下文清除snackbars
                              ScaffoldMessenger.of(context).clearSnackBars();
                              controller.handle_login();
                            },
                            style: ElevatedButton.styleFrom(
                              backgroundColor: Color(0xFFB4FF39),
                              padding: EdgeInsets.symmetric(vertical: 16.h),
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(15.r),
                              ),
                              elevation: 4,
                              shadowColor: Color(0xFFB4FF39).withOpacity(0.5),
                            ),
                            child: Text(
                              "Login",
                              style: TextStyle(
                                fontSize: 14.sp,
                                color: Colors.black87,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            ),
            SizedBox(height: 20.h),
            Padding(
              padding: EdgeInsets.symmetric(horizontal: 20.w),
              child: SizedBox(
                width: double.infinity,
                // Apple登录按钮添加淡入动画
                child: AnimatedOpacity(
                  opacity: 1.0,
                  duration: const Duration(milliseconds: 1200),
                  curve: Curves.easeInOut,
                  child: MouseRegion(
                    cursor: SystemMouseCursors.click,
                    child: GestureDetector(
                      onTapDown: (_) => controller.set_apple_button_scale(0.95),
                      onTapUp: (_) => controller.set_apple_button_scale(1.0),
                      onTapCancel: () => controller.set_apple_button_scale(1.0),
                      child: Obx(
                        () => AnimatedScale(
                          scale: controller.apple_button_scale.value,
                          duration: Duration(milliseconds: 150),
                          child: OutlinedButton(
                            onPressed: () {
                              // 添加按钮点击波纹效果
                              HapticFeedback.mediumImpact();
                              controller.handle_apple_login();
                            },
                            style: OutlinedButton.styleFrom(
                              side: BorderSide(color: Colors.white),
                              padding: EdgeInsets.symmetric(vertical: 16.h),
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(15.r),
                              ),
                              backgroundColor: Colors.white,
                            ),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Icon(
                                  Icons.apple,
                                  color: Colors.black,
                                  size: 24.r,
                                ),
                                SizedBox(width: 10.w),
                                Text(
                                  "Continue with Apple",
                                  style: TextStyle(
                                    color: Colors.black,
                                    fontSize: 14.sp,
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            ),
            SizedBox(height: 20.h),
            Center(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    "By Continuing you agree with ",
                    style: TextStyle(
                      fontSize: 10.sp,
                      color: Colors.white.withOpacity(0.5),
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                  TweenAnimationBuilder<double>(
                    duration: const Duration(milliseconds: 300),
                    tween: Tween<double>(begin: 1, end: 1.05),
                    builder: (context, value, child) {
                      return InkWell(
                        onTap: () {
                          HapticFeedback.selectionClick();
                          final Uri url = Uri.parse(
                            "https://www.freeprivacypolicy.com/live/2d8a19f6-2eb8-4536-8ab9-0b1789c0ac17",
                          );
                          launchUrl(url, mode: LaunchMode.inAppWebView);
                        },
                        splashColor: Color(0xFFCDFF5F).withOpacity(0.3),
                        highlightColor: Color(0xFFCDFF5F).withOpacity(0.1),
                        borderRadius: BorderRadius.circular(4.r),
                        child: MouseRegion(
                          cursor: SystemMouseCursors.click,
                          onEnter: (_) => controller.set_terms_scale(1.1),
                          onExit: (_) => controller.set_terms_scale(1.0),
                          child: Obx(
                            () => AnimatedScale(
                              scale: controller.terms_scale.value,
                              duration: Duration(milliseconds: 150),
                              child: Padding(
                                padding: EdgeInsets.all(2.w),
                                child: Text(
                                  "Terms of Service",
                                  style: TextStyle(
                                    fontSize: 10.sp,
                                    color: Color(0xFFCDFF5F),
                                    fontFamily: 'PingFang HK',
                                    fontWeight: FontWeight.w400,
                                    fontStyle: FontStyle.normal,
                                    height: 16 / 10,
                                    decoration: TextDecoration.underline,
                                    decorationColor: Color(0xFFCDFF5F),
                                    decorationStyle: TextDecorationStyle.solid,
                                    decorationThickness: 1,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                      );
                    },
                  ),
                  Text(
                    "  & ",
                    style: TextStyle(
                      fontSize: 10.sp,
                      color: Colors.white.withOpacity(0.5),
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                  TweenAnimationBuilder<double>(
                    duration: const Duration(milliseconds: 300),
                    tween: Tween<double>(begin: 1, end: 1.05),
                    builder: (context, value, child) {
                      return InkWell(
                        onTap: () {
                          HapticFeedback.selectionClick();
                          final Uri url = Uri.parse(
                            "https://www.freeprivacypolicy.com/live/3c2c565a-da96-4bda-9fd3-51e2625c89b5",
                          );
                          launchUrl(url, mode: LaunchMode.inAppWebView);
                        },
                        splashColor: Color(0xFFCDFF5F).withOpacity(0.3),
                        highlightColor: Color(0xFFCDFF5F).withOpacity(0.1),
                        borderRadius: BorderRadius.circular(4.r),
                        child: MouseRegion(
                          cursor: SystemMouseCursors.click,
                          onEnter: (_) => controller.set_privacy_scale(1.1),
                          onExit: (_) => controller.set_privacy_scale(1.0),
                          child: Obx(
                            () => AnimatedScale(
                              scale: controller.privacy_scale.value,
                              duration: Duration(milliseconds: 150),
                              child: Padding(
                                padding: EdgeInsets.all(2.w),
                                child: Text(
                                  "Privacy Policy",
                                  style: TextStyle(
                                    fontSize: 10.sp,
                                    color: Color(0xFFCDFF5F),
                                    fontFamily: 'PingFang HK',
                                    fontWeight: FontWeight.w400,
                                    fontStyle: FontStyle.normal,
                                    height: 16 / 10,
                                    decoration: TextDecoration.underline,
                                    decorationColor: Color(0xFFCDFF5F),
                                    decorationStyle: TextDecorationStyle.solid,
                                    decorationThickness: 1,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                      );
                    },
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
  
  @override
  Widget build(BuildContext context) {
    return GetBuilder<LoginController>(
      init: LoginController(),
      id: "login",
      builder: (_) {
        return Scaffold(
          resizeToAvoidBottomInset: false,
          body: SafeArea(top: false, bottom: false, child: _buildView(context)),
        );
      },
    );
  }
}
